<%@ include file="/common/taglibs.jsp"%>

<head>
<title><fmt:message key="searchBirth.title" /></title>
<meta name="menu" content="BirthSearchMenu" />
<script type="text/javascript" src="scripts/datetimepicker.js">
	//Date Time Picker script- by TengYong Ng of http://www.rainforestnet.com
	//Script featured on JavaScript Kit (http://www.javascriptkit.com)
	//For this script, visit http://www.javascriptkit.com
</script>
<style type="text/css">

fieldset.grp{
	background-color:#F0F4FD;
	
	border-width:2px;
	border-style:solid;
	border-color:#7070DB;
	
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	margin:0px 0px 15px 0px;
	width:220px;
	position:relative;
	display:block;
	padding: 0px 10px 0px 10px;
}

fieldset legend.grp1{
	background-color:#B2CCFF;
	border-width:1px;
	border-style:solid;
	border-color:#7070DB;
	color:#4B0082;
	font-weight:bold;
	font-variant:small-caps;
	font-size:100%;
    height : 22px;
    width : 70%; 	
	line-height:20px;
	padding:0px 5px;
	margin:0px 0px 2px 0px;
	position:relative;
	top: -12px;
	
}
div.search_results{
				float: left;
				padding-left: 2px;
				width: 640px;
				border: 0px solid gray;
			}
			
div.search_filters{
				float: left;
				padding: 0px;
				width: 260px;
				border: 0px solid gray;
}
ul,ol{padding:0;margin:0 0 2px 2px;}
input.dt{display:inline-block;width:176px;height:18px;padding:3px;margin-bottom:0px;font-size:13px;line-height:18px;color:#555555;border:1px solid #ccc;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
input,textarea,.uneditable-input{display:inline-block;width:200px;height:18px;
         padding:3px;margin-bottom:0px;font-size:13px;line-height:18px;color:#555555;
		 border:1px solid #ccc;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;
		 }
select{display:inline-block;width:210px;height:27px;
         padding:3px;margin-bottom:0px;font-size:13px;line-height:18px;color:#555555;
		 border:1px solid #ccc;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;
		 }		 
input,button,select,textarea{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;font-weight:normal;line-height:18px;}
label{font-family:"Verdana,Arial,Helvetica,sans-serif;font-size:13px;font-weight:normal;line-height:15px;}
label{display:block;margin-bottom:0px;color:#2929A3;}
select{display:block;}
select{height:28px;*margin-top:2px;line-height:28px;}
select{width:210px;background-color:#ffffff;}

</style>
</head>

<!--div>
	<h2>
		<fmt:message key="searchBirth.heading" />
	</h2>
	<p>
		<fmt:message key="searchBirth.message" />
	</p>
</div-->
<div class="search_filters" >
	<s:form name="searchBirthForm" action="searchBirthRecord.action" method="post"
		validate="true" cssClass="form-vertical" >
		
		<security:authorize ifAllGranted="ROLE_ADMIN">
		<fieldset class="grp">
			  <legend class="grp1">Search By Zone</legend>
			  <fieldset class="control-group">
			  <label for="zones" class="control-label"><fmt:message
							key="hospital.zone" /></label>
			  <select id="zone" name="hospital.zones.id">
							<s:iterator value="zones">
								<option value="<s:property value="id"/>">
									<s:property value="name" />
								</option>
							</s:iterator>
			</select>
			
			 </fieldset>
	     </fieldset>
		 
		 <fieldset class="grp">
			  <legend class="grp1">Search By Hospital</legend>
			    <fieldset class="control-group">
			  <label for="zones" class="control-label"><fmt:message
							key="birth.hospital" /></label>
			   <select id="zone" name="hospital.zones.id">
							<s:iterator value="zones">
								<option value="<s:property value="id"/>">
									<s:property value="name" />
								</option>
							</s:iterator>
			</select>
			
			</fieldset>
	     </fieldset>
		
	</security:authorize>
	
	
	  <security:authorize ifAllGranted="ROLE_ZONE_BIRTH">
		 
		 <fieldset class="grp">
			  <legend class="grp1">Search By Hospital</legend>
			    <fieldset class="control-group">
			  <label for="zones" class="control-label"><fmt:message
							key="birth.hospital" /></label>
			   <select id="zone" name="hospital.zones.id">
							<s:iterator value="zones">
								<option value="<s:property value="id"/>">
									<s:property value="name" />
								</option>
							</s:iterator>
			</select>
			
			</fieldset>
	     </fieldset>
		
	</security:authorize>
	
	
		 <fieldset class="grp">
			  <legend class="grp1">Search By ID</legend>
				<s:textfield name="birth.id" label="%{getText('search.id')}"/>
	     </fieldset>
		 
		 <fieldset class="grp">
			  <legend class="grp1">Search By Name</legend>
				<s:textfield name="birth.motherName" label="%{getText('search.motherName')}" />
				<s:textfield name="birth.fatherName" label="%{getText('search.fatherName')}" />
	     </fieldset>
		 
		 <fieldset class="grp">
			  <legend class="grp1">Search By Sex</legend>
				<s:select name="birth.sex" key="birth.sex"  list="#{'All':'All','Male':'Male','Female':'Female'}"></s:select>
	     </fieldset>
		 <fieldset class="grp">
			  <legend class="grp1">Search By Status</legend>
				<s:select name="birth.status" key="birth.status"  list="#{'':'All','Approved':'Approved','Rejected':'Rejected','Submit':'Submit','Draft':'Draft'}"></s:select>
	     </fieldset>
		 
		 <fieldset class="grp">
			  <legend class="grp1">Search By Date Range</legend>
				<fieldset class="control-group">
						<label class="control-label"> Start Date</label>
						<div class="controls">
							<input id="birthstartdate" name="birth.startDate" type="text" class="dt" readonly="readonly"

								size="20" title="date" contenteditable="false" value="${birth.birthDateString}"> <a
								href="javascript:NewCal('birthstartdate','ddmmmyyyy',false,24)"><img
								src="images/cal.gif" width="20" height="20" border="0"
								alt="Pick date and time" > </a>
						</div>
				</fieldset>
		
				<fieldset class="control-group">
						<label class="control-label"> End Date</label>
						<div class="controls">
							<input id="birthenddate" name="birth.endDate" type="text" class="dt" readonly="readonly"
								size="25" title="date" contenteditable="false" value="${birth.birthDateString}"> <a
								href="javascript:NewCal('birthenddate','ddmmmyyyy',false,24)"><img
								src="images/cal.gif" width="20" height="20" border="0"
								alt="Pick date and time" > </a>
						</div>
				</fieldset>
	     </fieldset>
		 
	
		<!--
		<s:date name="startDate" />
		<s:date name="endDate"/>
		-->

		<fieldset class="control-group">
			<s:submit key="button.search" name="search" cssClass="btn btn-primary" theme="simple" />
			<input type="button" value="<fmt:message key="button.cancel"/>" class="btn" onclick="this.form.onsubmit = null; location.href='mainMenu'" />
		</fieldset>
	</s:form>
</div>
<div class="search_results">		
		 <display:table name="birthList" cellspacing="0" cellpadding="0" requestURI=""
                   defaultsort="1" id="births" pagesize="25" class="table table-condensed" export="false">
        
        
        <security:authorize ifAllGranted="ROLE_HOSPITAL">
        	<display:column property="motherName" escapeXml="true" sortable="false" titleKey="birth.motherName" style="width: 20%"
                        url="/viewBirthDetails.action?from=hospitalSearch" paramId="id" paramProperty="id"/>
        </security:authorize>
        <security:authorize ifAllGranted="ROLE_ZONE_BIRTH">
        	<display:column property="motherName" escapeXml="true" sortable="false" titleKey="birth.motherName" style="width: 20%"
                        url="/viewBirthDetails.action?from=zoneSearch" paramId="id" paramProperty="id"/>
        </security:authorize>
        <security:authorize ifAllGranted="ROLE_ADMIN">
        	<display:column property="motherName" escapeXml="true" sortable="false" titleKey="birth.motherName" style="width: 20%"
                        url="/viewBirthDetails.action?from=adminSearch" paramId="id" paramProperty="id"/>
        </security:authorize>
        
        <display:column property="fatherName" escapeXml="true" sortable="false" titleKey="birth.fatherName"
                        style="width: 20%"/>
		<display:column property="status" escapeXml="true" sortable="false" title="Status"
                        style="width: 10%"/>                        
        <display:column property="sex" sortable="false" titleKey="birth.sex" style="width: 10%" autolink="true"
                        media="html"/>
        <display:column property="motherName" titleKey="birth.motherName" media="csv xml excel pdf"/>
        <display:column property="birthDate" sortable="false" titleKey="birth.birthDate" style="width: 25%" autolink="true"
                        media="html"/> 
        <display:column property="birthDate" titleKey="birth.birthDate" media="csv xml excel pdf"/>

        <display:setProperty name="paging.banner.item_name" value="birth record"/>
        <display:setProperty name="paging.banner.items_name" value="birth records"/>

        <display:setProperty name="export.excel.filename" value="Birth List.xls"/>
        <display:setProperty name="export.csv.filename" value="Birth List.csv"/>
        <display:setProperty name="export.pdf.filename" value="Birth List.pdf"/>
    </display:table>
</div>    
	

